.online_kefu{ position: fixed;  bottom: 10vh; right:1%; z-index: 9;}
.online_kefu ul li{ border: 1px solid #efefef; list-style-type:none; width:70px; height:70px; padding-top: 13px;  text-align: center; position: relative; background-color: rgba(255,255,255,0.8); color: #000; cursor: pointer; transition: background-color .2s linear 0s; perspective:1000;transform-style:preserve-3d;}
.online_kefu li i{font-size: 28px;}
.online_kefu ul li a{ color: #666666;}
.online_kefu ul li .con{ position: relative; line-height:25px;}
.online_kefu ul li .hover_con{border-radius: 3px; position: absolute; left:-100px; width: 120px; color: #ffffff !important; text-align: center;background-color: #0047ba;height:40px; line-height:40px; bottom: 7px; transform:rotateX(-90deg); transition: all .2s linear 0s; }
.online_kefu ul li .hover_con img{ width:100px;}
.online_kefu ul li.qrcode {  }
.online_kefu ul li.qrcode .hover_con{ height: 137px;padding: 10px;width: 130px;left: -141px;}
.online_kefu ul li.qrcode .hover_con p{ color: #fff; line-height:24px;}

.online_kefu li:hover{background-color:#0047ba; color: #fff;border: 1px solid #0047ba;}
.online_kefu li:hover i{ color: #fff;}
.online_kefu li:hover span{ color: #fff;}
.online_kefu li:hover p a{ color: #fff;}
.online_kefu li:hover .hover_con{left:-130px; transform:rotateY(0deg);}
.online_kefu li .hover_con:before{width: 0px;height: 0px;border: 8px solid transparent;border-left: 8px solid #0047ba; display: block; content: '';position: absolute; top: 12px;right: -16px; transition: top .2s linear ; transition-delay: .1s; }

.online_kefu li.qrcode:hover .hover_con{  bottom: -55px;}
.online_kefu li.qrcode:hover .hover_con:before{top: 48px;}

.mobile_mob{ display: none !important;}
@media (max-width: 1500px) {
    .online_kefu{ display: none;}
}